<template>
 <div class="box">
      <header class="header">
    <van-search v-model="value"  
  placeholder="请输入搜索关键词"  @search="onSearch" @cancel="onCancel">
<template #left>
  <van-icon name="arrow-left" size="22" @click="$router.back()" />
  </template>
</van-search>
      </header>
      <main class="main">
        <van-tabs v-model:active="active" @click-tab="onClickTab">
  <van-tab title="商品">
    <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
  <van-swipe-item>
    <van-grid>
  <van-grid-item icon="photo-o" text="板鞋" />
  <van-grid-item icon="photo-o" text="跑步鞋" />
  <van-grid-item icon="photo-o" text="休闲鞋" />
  <van-grid-item icon="photo-o" text="网球鞋" />
</van-grid>
  </van-swipe-item>
</van-swipe>
  </van-tab>
  <van-tab title="内容">好的商品</van-tab>
</van-tabs>
<van-empty v-if="list.length==0" description="描述文字" />
<div Lazyload v-else v-for="item in list">

  <van-card  num="1"  :price="item.price"   :title="item.title"  :thumb="item.image"/>

</div>

      </main>
    </div>
</template>

<script setup>
import reqest from '@/tool/request'
import {ref,onMounted} from 'vue'
import shake from '@/tool/request'
const list=ref([])
const value=ref('')
const qury=()=>{
  reqest.get('/search',{
    params:{
      value:value.value
    }
  }).then(res=>{
    if(res.data.code==200){
      list.value=res.data.data
    }
  })
}
onMounted(()=>{
  qury()
})
const onSearch=()=>{
  qury() 
}
 

</script>

<style lang="scss" scoped>

</style>